<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html lang="zh-cn">

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>订单详情</title>		
		<!--The current page style-->
		<link rel="stylesheet" type="text/css" href="${ctxStatic}/IDH/css/order_info/order_info.css" />

	</head>

	<body>
		<!-- head start  -->
		<%@ include file="/WEB-INF/views/modules/marketHeader.jsp"%>
		<!-- head end  -->

		<!--pc content start-->
		<!-- 取消订单 开始 -->
		<div class="modal fade" id="cancelOrder" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<h4 class="modal-title" id="myModalLabel">请您确认是否要取消订单！</h4>
					</div>
					<div class="modal-body">
						<div class="col-xs-12">
							<div class="row">
								<form id="cancelOrderForm" class="form-horizontal " action="" method="post">
									<input type="hidden" name="cancelId" id="cancelId" value=""/>
									<div class="form-group margin_bottom">
										<div class="col-lg-12  col-xs-12">取消说明 ：</div>
									</div>
									<div class="form-group margin_bottom">
										<div class="col-xs-12">
											<textarea name="cancelReason" id="cancelReason" cols="30" rows="10"></textarea>
										</div>
									</div>
									<div class="form-group text-center">
										<button type="button" class="btn btn-primary btn_yes" onclick="cancelOrder('${order.id }');">确定</button>
										<button type="button"  class="btn btn-default btn_cancel" data-dismiss="modal">取消</button>
									</div>
		                        </form>
							</div>
						</div>
                    </div>
                    <div class="modal-footer"></div>
				</div>
			</div>
		</div>
		<!-- 取消订单 结束 -->
		<section class="container content">
			<div class="col-xs-12">
				<div class="row">
					<ul class="nav nav-tabs" role="tablist" id="myTab">
						<li role="presentation" >
							<a href="${ctxf}/userfront/myAccount.html" >我的账户</a>
						</li>
						<li role="presentation" class="active">
							<a href="${ctxf}/userfront/toOrder" >我的订单</a>
						</li>
						<li role="presentation">
							<a href="${ctxf}/userfront/toAddress2">收货管理</a>
						</li>
					</ul>

					<div class="tab-content">
						<div role="tabpanel" class="tab-pane active" id="profile">
							<div class="order_info">
								<div class="col-lg-12 col-xs-12">
									<div class="row">
										<div class="box">
											<div class="col-lg-12  col-xs-12 order_number">
												<span>订单编号 ：</span><span class="number">${shopOrder.code }</span>
												<span class="order_date"><fmt:formatDate value="${shopOrder.createTime }"  pattern="yyyy-MM-dd HH:mm:ss"/> </span>
												<input type="hidden" name="shopOrderId" id="${shopOrder.id }" value="${shopOrder.id }"/>
												<p>订单状态 ： <span class="order_status">
												    <c:choose>
							                            <c:when test="${shopOrder.status == '1'}">待付款</c:when>
							                            <c:when test="${shopOrder.status == '2'}">已付款</c:when>
							                            <c:when test="${shopOrder.status == '3'}">待发货</c:when>
							                            <c:when test="${shopOrder.status == '4'}">已发货</c:when>
							                            <c:when test="${shopOrder.status == '5'}">完成交易</c:when>
							                            <c:when test="${shopOrder.status == '6'}">订单取消</c:when>
							                            <c:when test="${shopOrder.status == '7'}">申请退款</c:when>
							                            <c:when test="${shopOrder.status == '8'}">申请驳回</c:when>
							                            <c:when test="${shopOrder.status == '9'}">退款成功</c:when>
							                            <c:when test="${shopOrder.status == '10'}">退款失败</c:when>
							                        </c:choose>
												</span></p>
											</div>
											<div class="col-lg-12 col-xs-12 order_plan_status hidden-xs pc">
												<div class="row">
													<c:choose>
														<c:when test="${shopOrder.status == '1'}">
						                            		<ul class="ui-step ui-step-3">
																<li class="step-start step-active">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">1</span>
																		<span class="ui-step-cont-text">订单确认</span>
																	</div>
																</li>
																<li class="step-end">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">2</span>
																		<span class="ui-step-cont-text">付款成功</span>
																	</div>
																</li>
																<li class="step-end">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">3</span>
																		<span class="ui-step-cont-text">等待发货</span>
																	</div>
																</li>
																<li class="step-end">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">4</span>
																		<span class="ui-step-cont-text">卖家发货</span>
																	</div>
																</li>
																<li class="step-end">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">5</span>
																		<span class="ui-step-cont-text">完成交易</span>
																	</div>
																</li>
															</ul>
							                            </c:when>
							                            <c:when test="${shopOrder.status == '2'}"><!-- 已付款 -->
							                            	<ul class="ui-step ui-step-3">
																<li class="step-start step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">1</span>
																		<span class="ui-step-cont-text">订单确认</span>
																	</div>
																</li>
																<li class="step-active">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">2</span>
																		<span class="ui-step-cont-text">付款成功</span>
																	</div>
																</li>
																<li class="step-end">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">3</span>
																		<span class="ui-step-cont-text">等待发货</span>
																	</div>
																</li>
																<li class="step-end">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">4</span>
																		<span class="ui-step-cont-text">卖家发货</span>
																	</div>
																</li>
																<li class="step-end">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">5</span>
																		<span class="ui-step-cont-text">完成交易</span>
																	</div>
																</li>
															</ul>
							                            </c:when>
							                            <c:when test="${shopOrder.status == '3'}"><!-- 等待发货 -->
							                            	<ul class="ui-step ui-step-3">
																<li class="step-start step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">1</span>
																		<span class="ui-step-cont-text">订单确认</span>
																	</div>
																</li>
																<li class="step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">2</span>
																		<span class="ui-step-cont-text">付款成功</span>
																	</div>
																</li>
																<li class="step-active">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">3</span>
																		<span class="ui-step-cont-text">等待发货</span>
																	</div>
																</li>
																<li class="step-end">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">4</span>
																		<span class="ui-step-cont-text">卖家发货</span>
																	</div>
																</li>
																<li class="step-end">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">5</span>
																		<span class="ui-step-cont-text">完成交易</span>
																	</div>
																</li>
															</ul>
							                            </c:when>
							                            <c:when test="${shopOrder.status == '4'}"><!-- 卖家发货 -->
							                            	<ul class="ui-step ui-step-3">
																<li class="step-start step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">1</span>
																		<span class="ui-step-cont-text">订单确认</span>
																	</div>
																</li>
																<li class="step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">2</span>
																		<span class="ui-step-cont-text">付款成功</span>
																	</div>
																</li>
																<li class="step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">3</span>
																		<span class="ui-step-cont-text">等待发货</span>
																	</div>
																</li>
																<li class="step-active">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">4</span>
																		<span class="ui-step-cont-text">卖家发货</span>
																	</div>
																</li>
																<li class="step-end">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">5</span>
																		<span class="ui-step-cont-text">完成交易</span>
																	</div>
																</li>
															</ul>
							                            </c:when>
							                            <c:when test="${shopOrder.status == '5'}"><!-- 完成交易 -->
							                            	<ul class="ui-step ui-step-3">
																<li class="step-start step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">1</span>
																		<span class="ui-step-cont-text">订单确认</span>
																	</div>
																</li>
																<li class="step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">2</span>
																		<span class="ui-step-cont-text">付款成功</span>
																	</div>
																</li>
																<li class="step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">3</span>
																		<span class="ui-step-cont-text">等待发货</span>
																	</div>
																</li>
																<li class="step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">4</span>
																		<span class="ui-step-cont-text">卖家发货</span>
																	</div>
																</li>
																<li class="step-active">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">5</span>
																		<span class="ui-step-cont-text">完成交易</span>
																	</div>
																</li>
															</ul>
							                            </c:when>
							                            <c:when test="${shopOrder.status == '6'}"><!-- 订单关闭 -->
															<ul class="ui-step ui-step-3 text-center">
																<li class="step-start step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">1</span>
																		<span class="ui-step-cont-text">订单提交</span>
																	</div>
																</li>
																<li class="step-active">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">2</span>
																		<span class="ui-step-cont-text">订单关闭</span>
																	</div>
																</li>
															</ul>
							                            </c:when>
							                            <c:when test="${shopOrder.status == '7'}"><!-- 申请退款 -->
															<ul class="ui-step ui-step-3 text-center">
																<li class="step-start step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">1</span>
																		<span class="ui-step-cont-text">订单提交</span>
																	</div>
																</li>
																<li class="step-active">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">2</span>
																		<span class="ui-step-cont-text">申请退款</span>
																	</div>
																</li>
															</ul>
							                            </c:when>
							                            <c:when test="${shopOrder.status == '8'}"><!-- 申请退款驳回 -->
															<ul class="ui-step ui-step-3 text-center">
																<li class="step-start step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">1</span>
																		<span class="ui-step-cont-text">订单提交</span>
																	</div>
																</li>
																<li class="step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">2</span>
																		<span class="ui-step-cont-text">申请退款</span>
																	</div>
																</li>
																<li class="step-active">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">3</span>
																		<span class="ui-step-cont-text">申请驳回</span>
																	</div>
																</li>
															</ul>
							                            </c:when>
							                            <c:when test="${shopOrder.status == '9'}"><!-- 申请退款成功 -->
															<ul class="ui-step ui-step-3 text-center">
																<li class="step-start step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">1</span>
																		<span class="ui-step-cont-text">订单提交</span>
																	</div>
																</li>
																<li class="step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">2</span>
																		<span class="ui-step-cont-text">申请退款</span>
																	</div>
																</li>
																<li class="step-active">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">3</span>
																		<span class="ui-step-cont-text">退款成功</span>
																	</div>
																</li>
															</ul>
							                            </c:when>
							                            <c:when test="${shopOrder.status == '10'}"><!-- 申请退款失败 -->
							                            	<ul class="ui-step ui-step-3 text-center">
																<li class="step-start step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">1</span>
																		<span class="ui-step-cont-text">订单提交</span>
																	</div>
																</li>
																<li class="step-done">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">2</span>
																		<span class="ui-step-cont-text">申请退款</span>
																	</div>
																</li>
																<li class="step-active">
																	<div class="ui-step-line"></div>
																	<div class="ui-step-cont">
																		<span class="ui-step-cont-number">3</span>
																		<span class="ui-step-cont-text">退款失败</span>
																	</div>
																</li>
															</ul>
							                            </c:when>
							                        </c:choose>
												</div>
											</div>

											<!--phone 订单状态  开始-->
											<div class="phone_status_box visible-xs-block phone">
												<c:choose>
													<c:when test="${shopOrder.status == '1'}"><!-- 订单确认 -->
														<ul class="pinxiang1-list ui-step ui-step-3">
															<li class="step-start step-active">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">1</span>
																	<span class="ui-step-cont-text">订单确认</span>
																</div>
															</li>
															<li class="step-end">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">2</span>
																	<span class="ui-step-cont-text">付款成功</span>
																</div>
															</li>
															<li class="step-end">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">3</span>
																	<span class="ui-step-cont-text">等待发货</span>
																</div>
															</li>
															<li class="step-end">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">4</span>
																	<span class="ui-step-cont-text">卖家发货</span>
																</div>
															</li>
															<li class="step-end">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">5</span>
																	<span class="ui-step-cont-text">完成交易</span>
																</div>
															</li>
														</ul>
													</c:when>
													<c:when test="${shopOrder.status == '2'}"><!-- 已付款 -->
														<ul class="pinxiang1-list ui-step ui-step-3">
															<li class="step-start step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">1</span>
																	<span class="ui-step-cont-text">订单确认</span>
																</div>
															</li>
															<li class="step-active">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">2</span>
																	<span class="ui-step-cont-text">付款成功</span>
																</div>
															</li>
															<li class="step-end">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">3</span>
																	<span class="ui-step-cont-text">等待发货</span>
																</div>
															</li>
															<li class="step-end">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">4</span>
																	<span class="ui-step-cont-text">卖家发货</span>
																</div>
															</li>
															<li class="step-end">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">5</span>
																	<span class="ui-step-cont-text">完成交易</span>
																</div>
															</li>
														</ul>
													</c:when>
													<c:when test="${shopOrder.status == '3'}"><!-- 等待发货 -->
														<ul class="pinxiang1-list ui-step ui-step-3">
															<li class="step-start step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">1</span>
																	<span class="ui-step-cont-text">订单确认</span>
																</div>
															</li>
															<li class="step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">2</span>
																	<span class="ui-step-cont-text">付款成功</span>
																</div>
															</li>
															<li class="step-active">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">3</span>
																	<span class="ui-step-cont-text">等待发货</span>
																</div>
															</li>
															<li class="step-end">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">4</span>
																	<span class="ui-step-cont-text">卖家发货</span>
																</div>
															</li>
															<li class="step-end">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">5</span>
																	<span class="ui-step-cont-text">完成交易</span>
																</div>
															</li>
														</ul>
													</c:when>
													<c:when test="${shopOrder.status == '4'}"><!-- 卖家发货 -->
														<ul class="pinxiang1-list ui-step ui-step-3">
															<li class="step-start step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">1</span>
																	<span class="ui-step-cont-text">订单确认</span>
																</div>
															</li>
															<li class="step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">2</span>
																	<span class="ui-step-cont-text">付款成功</span>
																</div>
															</li>
															<li class="step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">3</span>
																	<span class="ui-step-cont-text">等待发货</span>
																</div>
															</li>
															<li class="step-active">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">4</span>
																	<span class="ui-step-cont-text">卖家发货</span>
																</div>
															</li>
															<li class="step-end">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">5</span>
																	<span class="ui-step-cont-text">完成交易</span>
																</div>
															</li>
														</ul>
													</c:when>
													<c:when test="${shopOrder.status == '5'}"><!-- 完成交易 -->
														<ul class="pinxiang1-list ui-step ui-step-3">
															<li class="step-start step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">1</span>
																	<span class="ui-step-cont-text">订单确认</span>
																</div>
															</li>
															<li class="step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">2</span>
																	<span class="ui-step-cont-text">付款成功</span>
																</div>
															</li>
															<li class="step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">3</span>
																	<span class="ui-step-cont-text">等待发货</span>
																</div>
															</li>
															<li class="step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">4</span>
																	<span class="ui-step-cont-text">卖家发货</span>
																</div>
															</li>
															<li class="step-active">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">5</span>
																	<span class="ui-step-cont-text">完成交易</span>
																</div>
															</li>
														</ul>
													</c:when>
													<c:when test="${shopOrder.status == '6'}"><!-- 订单关闭 -->
														<ul class="pinxiang1-list ui-step ui-step-3 text-center">
															<li class="step-start step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">1</span>
																	<span class="ui-step-cont-text">订单确认</span>
																</div>
															</li>
															<li class="step-active">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">2</span>
																	<span class="ui-step-cont-text">订单关闭</span>
																</div>
															</li>
														</ul>
													</c:when>
													<c:when test="${shopOrder.status == '7'}"><!--  申请退款 -->
														<ul class="pinxiang1-list ui-step ui-step-3 text-center">
															<li class="step-start step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">1</span>
																	<span class="ui-step-cont-text">订单确认</span>
																</div>
															</li>
															<li class="step-active">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">2</span>
																	<span class="ui-step-cont-text">申请退款</span>
																</div>
															</li>
														</ul>
													</c:when>
													<c:when test="${shopOrder.status == '8'}"><!-- 申请退款驳回 -->
														<ul class="pinxiang1-list ui-step ui-step-3 text-center">
															<li class="step-start step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">1</span>
																	<span class="ui-step-cont-text">订单确认</span>
																</div>
															</li>
															<li class="step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">2</span>
																	<span class="ui-step-cont-text">申请退款</span>
																</div>
															</li>
															<li class="step-active">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">3</span>
																	<span class="ui-step-cont-text">申请驳回</span>
																</div>
															</li>
														</ul>
													</c:when>
													<c:when test="${shopOrder.status == '9'}"><!-- 申请退款成功 -->
														<ul class="pinxiang1-list ui-step ui-step-3 text-center">
															<li class="step-start step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">1</span>
																	<span class="ui-step-cont-text">订单确认</span>
																</div>
															</li>
															<li class="step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">2</span>
																	<span class="ui-step-cont-text">申请退款</span>
																</div>
															</li>
															<li class="step-active">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">3</span>
																	<span class="ui-step-cont-text">退款成功</span>
																</div>
															</li>
														</ul>
													</c:when>
													<c:when test="${shopOrder.status == '10'}"><!-- 申请退款失败 -->
														<ul class="pinxiang1-list ui-step ui-step-3 text-center">
															<li class="step-start step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">1</span>
																	<span class="ui-step-cont-text">订单确认</span>
																</div>
															</li>
															<li class="step-done">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">2</span>
																	<span class="ui-step-cont-text">申请退款</span>
																</div>
															</li>
															<li class="step-active">
																<div class="ui-step-line"></div>
																<div class="ui-step-cont">
																	<span class="ui-step-cont-number">3</span>
																	<span class="ui-step-cont-text">退款失败</span>
																</div>
															</li>
														</ul>
													</c:when>
												</c:choose>
											</div>
											<!--phone 订单状态 结束-->

											<div class="col-lg-12 col-xs-12 order_list">
												<c:forEach items="${shopOrder.shopOrderInfoList }" var="orderInfo">
													<div class="item row">
														<div class="left col-lg-6 col-md-6 col-xs-9">
															<span class="order_img text-center">
															<img src="${path }${orderInfo.image }">
														</span>
															<div class="order_dec">
																<h5>${orderInfo.name }</h5>
																<p>商品编号： <span class="order_num">${orderInfo.product.code }</span></p>
															</div>
														</div>
														<div class="right col-lg-6 col-md-6 col-xs-3 text-right">
															<span class="col-lg-4 col-md-4 col-xs-12 text_color_red">￥ <span class="unit-price">${orderInfo.formatPrice }</span></span>
															<span class="col-lg-4 col-md-4 col-xs-12">x<span class="unit-num">${orderInfo.count }</span></span>
															<span class="col-lg-4 col-md-4 text_color_red hidden-xs">小计&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;￥ <span class="summation">${orderInfo.formatTotalAmount }</span></span>
														</div>
													</div>
												</c:forEach>
											</div>
											<div class="clearBoth"></div>
										</div>

										<!-- 收货信息 -->
										<div class="col-lg-12 col-xs-12 pay_address">
											<div class="order-track-box row">
												<div class="track-l col-lg-3">
													<ul class="track-method">
							                            <li>快递公司：
							                            <c:forEach items="${logisticsCodes }" var="logisticsCode">
								                                <c:if test="${shopOrder.shopOrderReceiving.company eq logisticsCode.logisticsCode}">
								                                     ${logisticsCode.logisticsCompany}
								                                </c:if>
								                         </c:forEach> 
							                           <%--  ${shopOrder.shopOrderReceiving.company } --%></li>
							                        	<li>货运单号：${shopOrder.shopOrderReceiving.code }</li>
							                        	<c:if test="${shopOrder.status eq 4 || shopOrder.status eq 5}">
							                        	    <c:if test="${not empty Estimateddeliverytime}">
							                        	        <li>预计到达时间：<fmt:formatDate value="${Estimateddeliverytime}"  pattern="yyyy-MM-dd"/></li>
							                        	    </c:if>
							                        	    <li>状态：${state}</li>
						                        	    </c:if>
						                        	</ul>
												</div>
												<div class="track-r col-lg-9">
													<div class="tracklist">
														<ul>
														     <!-- 已发货才有物流信息 -->
														    <c:if test="${shopOrder.status eq 4 || shopOrder.status eq 5}">
														          <c:forEach items="${traces }" var="traces"  varStatus="var">
														                  <c:if test="${var.first}">
														                      <li class="first">
															                      <i class="node-icon"></i>
															                      <span class="time"> ${traces.acceptTime } </span>
															                      <span class="txt">${traces.acceptStation } 
															                              <c:if test="${ !empty traces.remark }">
                                                                                                (${traces.remark } )
                                                                                        </c:if>
															                      </span>
														                      </li>
														                  </c:if>
														                  <c:if test="${!var.first}">
                                                                              <li>
                                                                                  <i class="node-icon"></i>
                                                                                  <span class="time"> ${traces.acceptTime } </span>
                                                                                  <span class="txt">${traces.acceptStation } 
                                                                                        <c:if test="${ !empty traces.remark }">
                                                                                                (${traces.remark } )
                                                                                        </c:if>
                                                                                   </span>
                                                                              </li>
                                                                          </c:if>
														          </c:forEach>
														    </c:if>
															<!-- <li><i class="node-icon"></i><span class="time">2016-06-05 8:00:05</span><span class="txt">您提交了订单，请等待何问起系统的确认</span></li>
															<li><i class="node-icon"></i><span class="time">2016-06-05 8:00:05</span><span class="txt">您提交了订单，请等待何问起系统的确认</span></li>
															<li><i class="node-icon"></i><span class="time">2016-06-05 8:00:05</span><span class="txt">您提交了订单，请等待何问起系统的确认</span></li>
															<li><i class="node-icon"></i><span class="time">2016-06-05 8:00:05</span><span class="txt">您提交了订单，请等待何问起系统的确认</span></li>
															<li><i class="node-icon"></i><span class="time">2016-06-05 8:00:05</span><span class="txt">您提交了订单，请等待何问起系统的确认</span></li>
															<li><i class="node-icon"></i><span class="time">2016-06-05 8:00:05</span><span class="txt">您提交了订单，请等待何问起系统的确认</span></li>
															<li><i class="node-icon"></i><span class="time">2016-06-05 8:00:05</span><span class="txt">您提交了订单，请等待何问起系统的确认</span></li>
															<li><i class="node-icon"></i><span class="time">2016-06-05 8:00:05</span><span class="txt">您提交了订单，请等待何问起系统的确认</span></li> -->
															
														</ul>
													</div>
												</div>
											</div>
											<div class="order-all-info row">
												<div class="col-lg-4 order-all-info-list">
													<div class="dl">
														<div class="dt">
															<h4>收货人信息</h4>
														</div>
														<div class="dd">
															<div class="item">
																<span class="item-l">收货人：</span>
																<div class="info-rcol">${shopOrder.shopOrderReceiving.name }</div>
															</div>
															<div class="item">
																<span class="item-l">地址：</span>
																<div class="info-rcol">
																	<span class="f-price">${shopOrder.shopOrderReceiving.address }</span>
																</div>
															</div>
															<div class="item">
																<span class="item-l">联系电话：</span>
																<div class="info-rcol">
																	${shopOrder.shopOrderReceiving.telephone }
																</div>
															</div>
															<div class="item">
																<span class="item-l">用户留言：</span>
																<div class="info-rcol-message figcaption">
																	<p>${shopOrder.comment}</p>
																</div>
															</div>
														</div>
													</div>
												</div>
												<div class="col-lg-4 order-all-info-list">
													<div class="dl">
														<div class="dt">
															<h4>发票信息</h4>
														</div>
														<div class="dd">
															<div class="item">
																<span class="item-l">发票类型：</span>
																<c:choose>
											                        <c:when test="${shopOrder.shopOrderReceipt.type == '1'}">
											                            <div class="info-rcol">增值税普通发票</div>
											                         </c:when>
											                         <c:when test="${shopOrder.shopOrderReceipt.type == '2'}">
											                            <div class="info-rcol">增值税专用发票</div>
											                          </c:when>
											                       </c:choose>
															</div>
															<div class="item">
																<span class="item-l">发票抬头：</span>
																<div class="info-rcol">
																	<span class="f-price">
																		<c:choose>
												                            <c:when test="${shopOrder.shopOrderReceipt.type == '1'}">
												                            	<span>${shopOrder.shopOrderReceipt.head }</span>
												                            </c:when>
												                            <c:when test="${shopOrder.shopOrderReceipt.type == '2'}">
												                            	<span>${shopOrder.shopOrderReceipt.name }</span>
												                            </c:when>
												                       </c:choose>
																	</span>
																</div>
															</div>
															<div class="item">
																<div  id="invoiceDetail">
																	<div class="info-rcol">
																		<c:choose>
												                            <c:when test="${shopOrder.shopOrderReceipt.type == '2'}">
												                            	<a href="javascript:void();" onclick="invoiceDetail();">点击查看明细</a>
												                            </c:when>
												                       </c:choose>
																	</div>
																</div>
																<div id="showInvoiceDetail" style="display:none;">
																	<span class="item-l">纳税人识别码：</span>
																	<div class="info-rcol">${shopOrder.shopOrderReceipt.code }</div>
																	<span class="item-l">注册地址：</span>
																	<div class="info-rcol">${shopOrder.shopOrderReceipt.address }</div>
																	<span class="item-l">开户银行：</span>
																	<div class="info-rcol">${shopOrder.shopOrderReceipt.bankName }</div>
																	<span class="item-l">银行账户：</span>
																	<div class="info-rcol">${shopOrder.shopOrderReceipt.bankAccount }</div>
																</div>
															</div>
														</div>
													</div>
												</div>
												<div class="col-lg-4 order-all-info-list">
													<div class="dl">
														<div class="dt">
															<h4>付款信息</h4>
														</div>
														<div class="dd">
															<div class="item">
																<span class="item-l">商品总额：</span>
																<div class="info-rcol all_price">${shopOrder.formatTotalAmountProduct }</div>
															</div>
															<div class="item">
																<span class="item-l">运费：</span>
																<div class="info-rcol">
																	<span class="f-price freight">¥${shopOrder.formatFreight }</span>
																</div>
															</div>
															<div class="item pay_money">
																
																<div class="pay_money">
																	<span class="f-price ">应支付金额：¥${shopOrder.formatTotalAmount }</span>
																</div>
															</div>
														</div>
													</div>
												</div>
											</div>

											<%-- <p class="hidden-xs">收货信息</p>
											<div class="addressContent row">
												<div class="money col-lg-4 col-xs-12">
													<div class="all_money_info">
														<p><span>商品总价</span><span class="text_color_red text_right">￥<span class="all_price">${shopOrder.formatTotalAmountProduct }</span></span></p>
														<p><span>运费</span><span class="text_color_red text_right">+ ￥<span class="freight">${shopOrder.formatFreight }</span></span></p>
														<p><span>应付款金额</span><span class="text_color_red text_right">￥<span class="pay_money">${shopOrder.formatTotalAmount }</span></span></p>
													</div>
												</div>
												<div class="pay text-right visible-xs-block">
													<c:choose>
							                            <c:when test="${shopOrder.status == '1'}">
							                            	<div class="btn btn-default btn_cancel" onclick="showCancelModal('${shopOrder.id }');">取消订单</div>
															<a href="${ctxf}/front/pay/showBank2?id=${shopOrder.id }"><div class="btn btn-primary btn_yes">立即支付</div></a>
							                            </c:when>
							                            <c:when test="${shopOrder.status == '2'}">已付款</c:when>
							                            <c:when test="${shopOrder.status == '3'}">待发货</c:when>
							                            <c:when test="${shopOrder.status == '4'}">已发货</c:when>
							                            <c:when test="${shopOrder.status == '5'}">完成交易</c:when>
							                            <c:when test="${shopOrder.status == '6'}">订单取消</c:when>
							                        </c:choose>
												</div>
												<div class="address col-lg-8 col-xs-12">
													<div>
														<ul class="col-lg-12 col-xs-12 ul-phone-font">
															<li><span>收货人姓名</span><span>${shopOrder.shopOrderReceiving.name }</span></li>
															<li><span>地址</span><span>${shopOrder.shopOrderReceiving.address }</span></li>
															<li><span>联系电话</span><span>${shopOrder.shopOrderReceiving.telephone }</span></li>
															<li><span>配送方式</span><span>${shopOrder.shopOrderReceiving.company }</span></li>
															<li><span>快递单号</span><span>${shopOrder.shopOrderReceiving.code }</span></li>
															<c:choose>
									                            <c:when test="${shopOrder.shopOrderReceipt.type == '1'}">
									                            	<li><span>发票信息</span><span>${shopOrder.shopOrderReceipt.head }</span></li>
									                            </c:when>
									                            <c:when test="${shopOrder.shopOrderReceipt.type == '2'}">
									                            	<li class="text-left">
									                            		<span>发票信息</span>
																		<span>
																			<ul class="col-md-12 padding-0">
																				<li>单位名称：${shopOrder.shopOrderReceipt.name }</li>
																				<li>纳税人识别码：${shopOrder.shopOrderReceipt.code }</li>
																				<li>注册地址：${shopOrder.shopOrderReceipt.address }</li>
																				<li>开户银行：${shopOrder.shopOrderReceipt.bankName }</li>
																				<li>银行账户：${shopOrder.shopOrderReceipt.bankAccount }</li>
																			</ul>
																		</span>
																	</li>
									                            </c:when>
									                       </c:choose>
														</ul>
														
													</div>

												</div>

											</div> --%>
											<div class="pay text-right hidden-xs">
											    <c:choose>
						                            <c:when test="${shopOrder.status == '1'}">
						                            	<div class="btn btn-default btn_cancel" onclick="showCancelModal('${shopOrder.id }');">取消订单</div>
														<a href="${ctxf}/front/pay/showBank2?id=${shopOrder.id }"><div class="btn btn-primary btn_yes">立即支付</div></a>
						                            </c:when>
						                            <c:when test="${shopOrder.status == '2'}">已付款</c:when>
						                            <c:when test="${shopOrder.status == '3'}">待发货</c:when>
						                            <c:when test="${shopOrder.status == '4'}">已发货</c:when>
						                            <c:when test="${shopOrder.status == '5'}">完成交易</c:when>
						                            <c:when test="${shopOrder.status == '6'}">订单取消</c:when>
						                        </c:choose>
											</div>
											<div class="pay text-right visible-xs-block">
												<c:choose>
						                            <c:when test="${shopOrder.status == '1'}">
						                            	<div class="btn btn-default btn_cancel" onclick="showCancelModal('${shopOrder.id }');">取消订单</div>
														<a href="${ctxf}/front/pay/showBank2?id=${shopOrder.id }"><div class="btn btn-primary btn_yes">立即支付</div></a>
						                            </c:when>
						                            <c:when test="${shopOrder.status == '2'}">已付款</c:when>
						                            <c:when test="${shopOrder.status == '3'}">待发货</c:when>
						                            <c:when test="${shopOrder.status == '4'}">已发货</c:when>
						                            <c:when test="${shopOrder.status == '5'}">完成交易</c:when>
						                            <c:when test="${shopOrder.status == '6'}">订单取消</c:when>
						                        </c:choose>
											</div>
										</div>
									</div>
								</div>
								<div class="clearBoth"></div>

							</div>
						</div>
					</div>

				</div>
			</div>
		</section>

		<!--pc content end-->

		<!--footer start-->
		<%@ include file="/WEB-INF/views/modules/marketFooter.jsp"%>
		<!--footer end-->

	</body>
	<script src="${ctxStatic}/IDH/js/jquery.nicescroll.js"></script>
	<script type="text/javascript">
		$('.tracklist').niceScroll({
	        cursorcolor: "#ccc",//#CC0071 光标颜色
	        cursoropacitymax: 1, //改变不透明度非常光标处于活动状态（scrollabar“可见”状态），范围从1到0
	        touchbehavior: false, //使光标拖动滚动像在台式电脑触摸设备
	        cursorwidth: "5px", //像素光标的宽度
	        cursorborder: "0", // 	游标边框css定义
	        cursorborderradius: "5px",//以像素为光标边界半径
	        autohidemode: false //是否隐藏滚动条
	    });
		
		
		$(".figcaption").each(function(i){
		    var divH = $(this).height();
		    var $p = $("p", $(this)).eq(0);
		    while ($p.outerHeight() > divH) {
		        $p.text($p.text().replace(/(\s)*([a-zA-Z0-9]+|\W)(\.\.\.)?$/, "..."));
		    };
		});
	
	
	
		$('#myTab li:eq(1) a').tab('show')
		
		//取消订单
		function showCancelModal(id){
			$("#cancelId").val(id);
			
			$('#cancelOrder').modal("show");
		}
		/* 
			reason:取消理由
			status:状态
			id：订单id
		*/
		function cancelOrder(){
			$.ajax({
				type:"POST",
				url:"${ctxf}/shop/order/myOrder/edit",
				data:{reason:$("#cancelReason").val(),status:"6",id:$("#cancelId").val()},
				async:false,
				success:function(msg){
					$('#cancelOrder').modal("hide");
					$("#cancelReason").val("");
					if(msg=="success"){
						toastr.success('订单取消成功！',{timeOut: 1000});
						setTimeout(function(){
							window.location.reload();
						},1000);
					}else{
						toastr.error('订单取消失败！',{timeOut: 1000});
					}
				}
			});
		}
		
		
		function invoiceDetail(){
			$("#invoiceDetail").css({"display":"none"});
			$("#showInvoiceDetail").css({"display":"block"});
		}
	</script>
</html>